<%@ page import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>

<%
String path=request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>发型工作室-客户信息管理</title>

    <meta name="description" content="Dynamic tables and grids using jqGrid plugin" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

   <!-- bootstrap & fontawesome -->
    <link rel="stylesheet" href="../util/css/bootstrap.min.css" />
    <link rel="stylesheet" href="../util/font-awesome/4.5.0/css/font-awesome.min.css" />

    <!-- page specific plugin styles -->
    <link rel="stylesheet" href="../util/css/jquery-ui.min.css" />
    <link rel="stylesheet" href="../util/css/bootstrap-datepicker3.min.css" />
    <link rel="stylesheet" href="../util/css/ui.jqgrid.min.css" />

    <!-- text fonts -->
    <link rel="stylesheet" href="../util/css/fonts.googleapis.com.css" />

    <!-- ace styles -->
    <link rel="stylesheet" href="../util/css/ace.min.css" class="ace-main-stylesheet" id="main-ace-style" />

    <!--[if lte IE 9]>
    <link rel="stylesheet" href="../util/css/ace-part2.min.css" class="ace-main-stylesheet" />
    <![endif]-->
    <link rel="stylesheet" href="../util/css/ace-skins.min.css" />
    <link rel="stylesheet" href="../util/css/ace-rtl.min.css" />

    <!--[if lte IE 9]>
    <link rel="stylesheet" href="../util/css/ace-ie.min.css" />
    <![endif]-->

    <!-- inline styles related to this page -->

    <!-- ace settings handler -->
    <script src="../util/js/ace-extra.min.js"></script>

    <!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

    <!--[if lte IE 8]>
    <script src="../util/js/html5shiv.min.js"></script>
    <script src="../util/js/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<div id="navbar" class="navbar navbar-default ace-save-state">
    <div class="navbar-container ace-save-state" id="navbar-container">
        <button type="button" class="navbar-toggle menu-toggler pull-left" id="menu-toggler" data-target="#sidebar">
            <span class="sr-only">侧边栏</span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>

            <span class="icon-bar"></span>
        </button>

        <div class="navbar-header pull-left">
            <a href="admin/login.html" class="navbar-brand">
                <small>
                    <i class="fa fa-leaf"></i>
                    发型工作室
                </small>
            </a>
        </div>

        <div class="navbar-buttons navbar-header pull-right" role="navigation">
            <ul class="nav ace-nav">

                <li class="light-blue dropdown-modal">
                    <a data-toggle="dropdown" href="#" class="dropdown-toggle">
                        <img class="nav-user-photo" src="../img/avatars/user.jpg" alt="Jason's Photo" />
                        <span class="user-info">
									<small>欢迎您</small>
									Admin
								</span>

                        <i class="ace-icon fa fa-caret-down"></i>
                    </a>

                    <ul class="user-menu dropdown-menu-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
                        <li>
                            <a href="#" data-toggle="modal" data-target="#changePassword">
                                <i class="ace-icon fa fa-cog"></i>
                                修改密码
                            </a>
                        </li>

                        <li class="divider"></li>

                        <li>
                            <a href="<%=basePath %>login/cancellation">
                                <i class="ace-icon fa fa-power-off"></i>
                                注销
                            </a>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </div><!-- /.navbar-container -->
</div>

<!-- 修改密码遮罩层（模态框） -->
<div class="modal fade" id="changePassword" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width: 400px;">
        <div class="modal-content">
            <div class="card card-primary">
                <div class="widget-header">
                    <h3 class="card-title">修改密码</h3>
                </div>
                <!-- /.card-header -->
                <!-- form start -->
                <form action="<%=basePath %>login/changePassword" class="form-horizontal" onsubmit="return changePassword()" method="post">
                    <table>
                        <div class="widget-main">
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right">旧密码</label>

                                <div class="col-sm-8">
                                    <input type="password" class="form-control" id="password" name="password" placeholder="请输入当前密码">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right">新密码</label>

                                <div class="col-sm-8">
                                    <input type="password" class="form-control" id="newPassword_1" name="newPassword_1" placeholder="请输入新密码">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label no-padding-right">确认密码</label>

                                <div class="col-sm-8">
                                    <input type="password" class="form-control" id="newPassword_2" name="newPassword_2" placeholder="请确认新密码">
                                </div>
                            </div>
                        </div>
                        <!-- /.card-body -->
                        <div class="modal-footer">
                            <span style="color: red;" id="span_password"></span>
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            <button type="submit" id="change" class="btn btn-primary">提交更改</button>
                        </div>
                    </table>
                </form>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<!-- 头部 -->

<div class="main-container ace-save-state" id="main-container">
    <script type="text/javascript">
        try{ace.settings.loadState('main-container')}catch(e){}
    </script>

    <!-- 侧边栏 -->
    <div id="sidebar" class="sidebar responsive ace-save-state">
        <script type="text/javascript">
            try{ace.settings.loadState('sidebar')}catch(e){}
        </script>

        <div class="sidebar-shortcuts" id="sidebar-shortcuts">
            <div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
                <img src="../img/avatars/user.jpg" alt="" />
                <span style="font-size: 18px;">AdminAdmin</span>
            </div>

            <div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini">
                <span class="btn btn-success"></span>

                <span class="btn btn-info"></span>

                <span class="btn btn-warning"></span>

                <span class="btn btn-danger"></span>
            </div>
        </div><!-- /.sidebar-shortcuts -->

        <ul class="nav nav-list">
            <li class="">
                <a href="<%=basePath %>clientele/select">
                    <i class="menu-icon fa fa-user"></i>
                    <span class="menu-text"> 客户信息管理 </span>
                </a>

                <b class="arrow"></b>
            </li>

            <li class="">
                <a href="<%=basePath %>recharge/select">
                    <i class="menu-icon fa fa-credit-card"></i>
                    <span class="menu-text"> 客户充值 </span>
                </a>

                <b class="arrow"></b>
            </li>

            <li class="">
                <a href="<%=basePath %>consumption/select">
                    <i class="menu-icon fa fa-bars"></i>
                    <span class="menu-text"> 客户服务结算 </span>
                </a>

                <b class="arrow"></b>
            </li>

            <li class="">
                <a href="#" class="dropdown-toggle">
                    <i class="menu-icon fa fa-users"></i>
                    <span class="menu-text">
								员工管理
							</span>

                    <b class="arrow fa fa-angle-down"></b>
                </a>

                <b class="arrow"></b>

                <ul class="submenu">
                    <li class="">
                        <a href="<%=basePath %>typeManagement/select">
                            <i class="menu-icon fa fa-caret-right"></i>

                            员工类型管理
                        </a>

                        <b class="arrow"></b>

                    </li>

                    <li class="">
                        <a href="<%=basePath %>staffManagement/select">
                            <i class="menu-icon fa fa-caret-right"></i>
                            员工信息管理
                        </a>

                        <b class="arrow"></b>
                    </li>
                </ul>
            </li>

            <li class="">
                <a href="<%=basePath %>serviceProject/select">
                    <i class="menu-icon fa fa-print"></i>
                    <span class="menu-text"> 服务项目管理 </span>
                </a>

                <b class="arrow"></b>
            </li>

            <li class="">
                <a href="#" class="dropdown-toggle">
                    <i class="menu-icon fa fa-briefcase"></i>
                    <span class="menu-text">
								统计功能
							</span>

                    <b class="arrow fa fa-angle-down"></b>
                </a>

                <b class="arrow"></b>

                <ul class="submenu">
                    <li class="">
                        <a href="<%=basePath %>statistical/salary">
                            <i class="menu-icon fa fa-caret-right"></i>

                            统计工资结算
                        </a>

                        <b class="arrow"></b>

                    </li>

                    <li class="">
                        <a href="statistics.html">
                            <i class="menu-icon fa fa-caret-right"></i>
                            统计盈收
                        </a>

                        <b class="arrow"></b>
                    </li>

                    <li class="">
                        <a href="<%=basePath %>spending/select">
                            <i class="menu-icon fa fa-caret-right"></i>
                            支出项目统计
                        </a>

                        <b class="arrow"></b>
                    </li>
                </ul>
            </li>
        </ul><!-- /.nav-list -->

        <div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse">
            <i id="sidebar-toggle-icon" class="ace-icon fa fa-angle-double-left ace-save-state" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i>
        </div>
    </div>

    <!-- 侧边栏 -->

    <!-- 主体内容 -->
    <div class="main-content">
        <div class="main-content-inner">
            <div class="breadcrumbs ace-save-state" id="breadcrumbs">
                <ul class="breadcrumb">
                    <li>
                        <i class="ace-icon fa fa-home home-icon"></i>
                        <a href="admin/login.html">主页</a>
                    </li>
                    <li>
                        <a href="employeeManage.html">员工信息管理</a>
                    </li>
                    <li class="active">员工详情</li>
                </ul><!-- /.breadcrumb -->
            </div>

            <div class="page-content">
                <div class="page-header">
                    <div class="container-fluid">
                        <div class="row mb-2">
                            <div class="col-sm-6">
                                <h1>员工详情页面</h1>
                            </div>
                        </div>
                    </div>
                </div><!-- /.page-header -->

                <div class="row">
                    <div class="col-xs-12">
                        <div class="card card-primary">
                            <div class="widget-header">
                                <h3 class="card-title">员工信息</h3>
                            </div>
                            <!-- /.card-header -->
                            <!-- form start -->
                    <form id="employeeManage" action="<%=basePath %>staffManagement/addStaffManagement" class="form-horizontal" onsubmit="return edit()" method="post" enctype="multipart/form-data" >
                                <div class="widget-main">
                                    <div class="row">
                                        <div class="col-xs-12 col-md-4">
                                            <div class="form-group">
                                                <div>
                                                    <img src='' alt="photo" style="width: 200px">
                                                </div>
                                                <div class="input-group">
                                                    <div class="custom-file">
                                                        <input type="file" name="file" class="file custom-file-input" id="exampleInputFile">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xs-12 col-md-8">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <label for="">员工工号</label>
                                                        <input class="form-control" name="number" value=''>
                                                    </div>
                                                </div>
                                                 <input class="id" style="display:none;" type="text" value='0' name ="id">
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label for="">员工手机号</label>
                                                        <input class="form-control" name="phone" value=''>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label for="">员工姓名</label>
                                                        <input class="form-control" name="name" value=''>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label>员工类型</label>
                                                        <select name="typeId" id="typeSelect" class="form-control select2 select2-hidden-accessible"tabindex="-1" aria-hidden="true">
                                                            <option selected="selected" value="">--员工类型--</option>
                           									<c:forEach items="${listet}" var="l">
                           									<option  value='<c:out value="${l.id }"/>'><c:out value="${l.name}"/></option>
                           									</c:forEach>
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4" id="password">
                                                    <div class="form-group">
                                                        <label for="exampleInputPassword1">密码</label>
                                                        <input type="password" name="password" class="form-control" value='' id="exampleInputPassword1" placeholder="Password">
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label for="exampleInputPassword1">性别</label>
                                                        <div class="form-check">
                                                            </select>
                                                            <input name="sex" class="form-check-input" type="radio" value="男" checked="checked">
                                                            <label class="form-check-label">男</label>
                                                        </div>
                                                        <div class="form-check">
                                                            <input name="sex" class="form-check-input" type="radio" value="女">
                                                            <label class="form-check-label">女</label>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label>是否在职</label>
                                                        <select name="status" class="form-control select2 select2-hidden-accessible"tabindex="-1" aria-hidden="true">
                                                            <option selected="selected" value="">--在职状况--</option>
                                                            <option value="在职">在职</option>
                                                            <option value="离职">离职</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                              </div>
                                <!-- /.card-body -->
                                <div class="clearfix form-actions">
                                    <button type="submit" class="btn btn-info">提交</button>
                                </div>
                            </form>
                           
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 底部版权信息 -->
    <div class="footer">
        <div class="footer-inner">
            <div class="footer-content">
						<span class="bigger-120">
							<span class="blue bolder">发型工作室</span>
							管理系统 &copy; 2018-06-04
						</span>
            </div>
        </div>
    </div>
    <!-- 底部版权信息 -->

    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
    </a>
</div><!-- /.main-container -->

<!-- basic scripts -->

<!--[if !IE]> -->
<script src="../util/js/jquery-2.1.4.min.js"></script>

<!-- <![endif]-->

<!--[if IE]>
<script src="../util/js/jquery-1.11.3.min.js"></script>
<![endif]-->
<script type="text/javascript">
    if('ontouchstart' in document.documentElement) document.write("<script src='util/js/jquery.mobile.custom.min.js'>"+"<"+"/script>");
</script>
<script src="../util/js/bootstrap.min.js"></script>

<!-- page specific plugin scripts -->
<script src="../util/js/bootstrap-datepicker.min.js"></script>
<script src="../util/js/jquery.jqGrid.min.js"></script>
<script src="../util/js/grid.locale-en.js"></script>

<!-- ace scripts -->
<script src="../util/js/ace-elements.min.js"></script>
<script src="../util/js/ace.min.js"></script>

<script>
    //修改密码表单验证
    function changePassword() {
        var oldPassword = document.getElementById('password').value;
        var newPassword_1 = document.getElementById('newPassword_1').value;
        var newPassword_2 = document.getElementById('newPassword_2').value;
        if (oldPassword == ""){
            document.getElementById("span_password").innerHTML='请输入当前密码';
            return false;
        }else if (newPassword_1 == ""){
            document.getElementById("span_password").innerHTML='请输入新密码';
            return false;
        }else if (newPassword_2 == ""){
            document.getElementById("span_password").innerHTML='请输入确认密码';
            return false;
        }else if (newPassword_1 != newPassword_2){
            document.getElementById("span_password").innerHTML='新密码和确认密码不一致';
            return false;
        }
        return true;
    }
    //修改客户信息表单验证
    function edit() {
        var username = document.getElementById('username').value;
        var phone = document.getElementById('phone').value;
        var name = document.getElementById('name').value;

        var status = document.getElementById('status');//下拉框值
        var index=status.selectedIndex ;             // selectedIndex代表的是你所选中项的index
        var status_value = status.options[index].value;

        if (username == ""){
            document.getElementById("span_edit").innerHTML='请输入客户账户';
            return false;
        }else if (phone == ""){
            document.getElementById("span_edit").innerHTML='请输入客户手机号';
            return false;
        }else if (name == ""){
            document.getElementById("span_edit").innerHTML='请输入客户姓名';
            return false;
        }else if (status_value == ""){
            document.getElementById("span_edit").innerHTML='请选择客户状态';
            return false;
        }
        return true;
    }
    function lick(obj, id){
        var td_content = $(obj).parents("tr").children("td");  //获取当前行中的所有td值

        var username = td_content.eq(1).text(); //获取当前行第二个td的值
        var phone = td_content.eq(2).text(); //获取当前行第二个td的值
        var name = td_content.eq(3).text(); //获取当前行第二个td的值
        var status = td_content.eq(5).text(); //获取当前行第二个td的值

        document.getElementById('username').value = username;
        document.getElementById('phone').value = phone;
        document.getElementById('name').value = name;
        document.getElementById('status').value = status;
    }
</script>
</body>
</html>